<script lang="ts" setup>
import type {SimpleUserInfo} from "../../network/types/User.ts";
import UserRoute from "../routes/UserRoute.vue";

interface Props {
  data: SimpleUserInfo
}

const props = defineProps<Props>()

</script>

<template>
  <div class="max-width-text" style="display: inline-block;padding: 5px;border: 1px dashed #10749b;max-width: 200px">
    <span class="flex-center">
      <el-avatar :src="data?.avatars?.[0]" shape="square" style="margin-right: 5px;"/>
      <user-route :user-id="data?.userId" :username="data.username">{{ data.username }}</user-route>
    </span>
  </div>
</template>

<style scoped>

</style>